<template>
<span>
  <span v-if="!timeout">
    {{t.day}}天{{t.hour}}时{{t.minite}}分{{t.second}}秒
  </span>
  <span v-else>
    已过期
  </span>
</span>
</template>

<script>
import {leftTime, formatDate} from '@/common/js/util'
export default {
  name: 'time-reduce',
  props: ['displayTime'],
  data () {
    return {
      t: {
        day: 0,
        hour: 0,
        minite: 0,
        second: 0
      },
      timeout: false
    }
  },
  mounted () {
    const ORDER_OUT_DATE_TIME = 0
    let _this = this
    if (!this.displayTime) {
      this.timeout = true
    }
    let orderCreateTime = new Date(this.displayTime.replace(/-/g, '/')).getTime()
    let dist = new Date(formatDate(new Date(), 'yyyy-MM-dd').replace(/-/g, '/')) - new Date()
    let timer = setInterval(() => {
      var left = leftTime(ORDER_OUT_DATE_TIME, (dist + (new Date() - orderCreateTime)))
      if (left.minite <= 0 && left.second <= 0) {
        clearInterval(timer)
        _this.timeout = true
        location.reload()
      } else {
        this.t = left
      }
    }, 1000)
  }
}
</script>

